window.onload = function () {
    fullTable(emList)

}

function fullTable(array) {
    let str = "";
    array.forEach(n => {
        str += `<tr><td>${n.code}</td><td>${n.name}</td><td>${n.money}</td><td>${n.sex}</td>
        <td><input type="button" value="删除" onclick="del(${n.code})"><input type="button" value="修改" onclick="findById(${n.code})"></td>
  
</tr>`
    });
    $("data").innerHTML = str;
}

/**
 * 通过id获取元素事件
 * @param id
 * @returns {HTMLElement}
 */
function $(id) {
    return document.getElementById(id);
}

/**
 * 通过名字找对象
 */
function findByName() {
    var nameStr = $("nameTxt").value;
    var newList = emList.filter(n => n.name.indexOf(nameStr) != -1);
    fullTable(newList);
}

/**
 * 通过id删除用户
 * @param code id
 */
function del(code) {
    let index = emList.findIndex(n => n.code == code);
    emList.splice(index, 1);
    fullTable(emList)
}

function showAddDiv() {
    $("addDIv").style.visibility = "visible";
}

/**
 * 添加用户
 */
function add() {
    if (checkcode() & checkName() & checkmoney() & checksex()) {
        let obj = {
            code: $("codeTxt").value,
            name: $("emNameTxt").value,
            money: $("moneyTxt").value,
            sex: $("sexTxt").value
        }
        emList.push(obj);
        //提交表单
        fullTable(emList);
        $("addDIv").style.visibility = "hidden";
        //将文本框赋值空字符串
        $("codeTxt").value = ""
        $("emNameTxt").value = ""
        $("moneyTxt").value = ""
        $("sexTxt").value = ""
        $("codeInfo").innerHTML = "";
        $("nameInfo").innerHTML = "";
        $("moneyInfo").innerHTML = "";
        $("sexInfo").innerHTML = "";
        //添加完成用户后排序
        sort()
    }

}

/**
 * 按照id查询
 * @param code
 */
function findById(code) {
    let emObj = emList.find(n => n.code == code);
    $("codeSpan").innerHTML = emObj.code;
    $("nameSpan").innerHTML = emObj.name;
    $("moneySpan").value = emObj.money;
    $("sexSpan").value = emObj.sex;
    $("updateDiv").style.visibility = "visible";
}

/**
 * 修改用户
 */
function update() {
    let code = $("codeSpan").innerHTML
    let obj = emList.find(n => n.code == code)
    obj.money = $("moneySpan").value
    $("updateDiv").style.visibility = "hidden";
    fullTable(emList);
}


function checkFormElement(rexp, textId, spanId, errorInfo) {
    if (rexp.test($(textId).value)) {
        $(spanId).innerHTML = "验证通过";
        $(spanId).style.color = "green";
        return true;
    } else {
        $(spanId).innerHTML = errorInfo;
        $(spanId).style.color = "red";
        return false;
    }
}

/**
 * 用户的验证
 */
function checkcode() {
    var a = checkFormElement(/\d$/, 'codeTxt', 'codeInfo', '必须是数字');
    if (a == false) {
        return false
    }

    let code = $("codeTxt").value
    var codes = emList.find(n => n.code == code);
    if (codes == undefined) {
        $("codeInfo").innerHTML = "验证通过"
        return true
    } else {
        $("codeInfo").innerHTML = "不能添加重复"
    }
}

/**
 * 正则表达式
 */

function checkName() {
    return checkFormElement(/^[\u4e00-\u9fa5]{2,}$/, 'emNameTxt', 'nameInfo', '姓名中文')
}

function checkmoney() {
    return checkFormElement(/^\d{4,5}$/, 'moneyTxt', 'moneyInfo', '必须是数字')
}

function checksex() {
    return checkFormElement(/^[男女]$/, 'sexTxt', 'sexInfo', '男或者女')
}

/**
 *排序
 */
var isSort = false
function sort(sortName) {
    if (isSort) {
        emList.sort((a, b) => a[sortName] - b[sortName]);
    } else {
        emList.sort((a, b) => b[sortName] - a[sortName]);
    }
    isSort = !isSort
    fullTable(emList)
}